<div id="new_state" data-hook></div>
<div class="table-responsive">
  <table class="table" id='listing_states' data-hook>
    <thead>
      <tr data-hook="states_header">
        <th><%= Spree.t(:name) %></th>
        <th class="text-center"><%= Spree.t(:abbreviation) %></th>
        <th class="actions"></th>
      </tr>
    </thead>
    <tbody>
      <% @states.each do |state| %>
        <tr id="<%= spree_dom_id state %>" data-hook="states_row">
          <td><%= state.name %></td>
          <td class="text-center"><%= state.abbr %></td>
          <td class="actions actions-2 text-right">
            <%= link_to_edit(state, no_text: true) if can? :edit, state %>
            <%= link_to_delete(state, no_text: true) if can? :delete, state %>
          </td>
        </tr>
      <% end %>
      <% if @states.empty? %>
        <tr><td colspan="3"><%= Spree.t(:none) %></td></tr>
      <% end %>
    </tbody>
  </table>
</div>
